// http://www.lostdecadegames.com/how-to-make-a-simple-html5-canvas-game/

// Create the canvas
var canvas = document.createElement("canvas");
//var menu = document.canvas.getContext("2d").createElement("div");
var ctx = canvas.getContext("2d");

canvas.width = window.innerWidth - 350;      //512
canvas.height = window.innerHeight - 38;     //480

document.body.appendChild(canvas);


// Background image
var bgReady = false;
var bgImage = new Image();
bgImage.onload = function () {
    bgReady = true;
};
//bgImage.src = "images/background.png";
bgImage.src = "images/backgroundMap4.jpg";

// Hero image
/*var heroReady = false;
var heroImage = new Image();
heroImage.onload = function () {
    heroReady = true;
};
heroImage.src = "images/tankR.png";*/

// The tank object
var tank1 = new Tank(1);




// Monster image
var monsterReady = false;
var monsterImage = new Image();
monsterImage.onload = function () {
    monsterReady = true;
};
//monsterImage.src = "images/monster.png";
monsterImage.src = "images/tankL.png";

// bullet image
var bulletReady = false;
var bulletImage = new Image();
bulletImage.onload = function () {
    bulletReady = true;
};
bulletImage.src = "images/bullet.png";

// Game objects
/*var hero = {
    speed: 100, // movement in pixels per second             256
    positionOnMap: "left"
};*/

var monster = {
    speed: 100
};
var monstersCaught = 0;

var bullet = {
    speed: 256
};


// Handle keyboard controls
var keysDown = {};
var event = {};


var vx = 1;
var shotT = false;
var bulletStatus = true;

var tr = true;
var endX = 0;
var endY = 0;
var bulletIsFly = false;

var unit = null;

// The main game loop
var main = function () {
    var now = Date.now();
    var delta = now - then;

    update(delta / 1000);
    render();

    then = now;
};


addEventListener("keydown", function (e) {
    keysDown[e.keyCode] = true;
}, false);

addEventListener("keyup", function (e) {
    delete keysDown[e.keyCode];
}, false);


// my function setPositionForUnit;
setPositionUnit = function (unit, x, y) {
    unit.x = x;
    unit.y = y;
}


var unitBehavior = function (unit) {

}


// Reset the game when the player catches a monster
var reset = function () {
    setPositionUnit(monster, (canvas.width + 100), (canvas.height - 300));
    //monsterImage.src = "images/monster.png";
    monsterImage.src = "images/tankMonsterL.png";
};


// my function label for unit
var setLabelForUnit = function (unit, text) {
    ctx.beginPath();
    ctx.fillText(text + unit.x + " : " + unit.y, unit.x + 30, unit.y + 0);
    ctx.font = "11px Times New Roman";
    ctx.fillStyle = 'white';
    ctx.closePath();
}


var shots = function (x, y, p) {

    if (vx < 500 && bulletStatus != false) {

        const startPos = x + vx + 60;     // +60 this is correcty for bullet x
        const newY = y + 28;    // +28 this is correcty for bullet y

        if (tr) {
            endX = startPos;
            endY = newY;
            tr = false;

        }

        setPositionUnit(bullet, endX + vx, endY);
        vx = vx + 4;       // 4 is speed bullet
    } else {
        //vx = vx - vx;
        bulletStatus = false;
        bullet.x = 5000;
        vx = 0;
        tr = true;
        bulletIsFly = false;
    }


}



// Update game objects
var update = function (modifier) {

    if (!(39 in keysDown && 38 in keysDown) && !(37 in keysDown && 38 in keysDown) && !(37 in keysDown && 40 in keysDown)  && !(39 in keysDown && 40 in keysDown)) {  // disable up&right, etc

        if (38 in keysDown) { // Player holding up

            if (tank1.y >= 0 || tank1.x <= canvas.height) {
                tank1.y -= tank1.getSpeed() * modifier;
                tank1.setImageSrc("images/tankU.png");
                tank1.setPositionOnMap("up");
            }




        }
        if (40 in keysDown) { // Player holding down
            tank1.y += tank1.getSpeed() * modifier;
            tank1.setImageSrc("images/tankD.png");
            tank1.setPositionOnMap("down");
        }
        if (37 in keysDown) { // Player holding left
            tank1.x -= tank1.getSpeed() * modifier;
            tank1.setImageSrc("images/tankL.png");
            tank1.setPositionOnMap("left");
        }
        if (39 in keysDown) { // Player holding right
            tank1.x += tank1.getSpeed() * modifier;
            tank1.setImageSrc("images/tankR.png");
            tank1.setPositionOnMap("right");
        }
        if (32 in keysDown) { // Player Огонь
            //bullet.x += bullet.speed * modifier;
            shotT = true;

            if (bulletReady == false && !bulletIsFly) {
                bulletReady = true;
                shotT = false;
                bulletIsFly = true;
            } else {
                bulletReady = false;
            }

        }

    }


    if (monster.x > 10) {
        setPositionUnit(monster, monster.x - Math.random(), monster.y);
    } else if (monster.x < 10) {
        setPositionUnit(monster, monster.x - Math.random(), monster.y);
        reset();
    }


    // Are they touching?
    if (
        tank1.x <= (monster.x + 32)
            && monster.x <= (tank1.x + 32)
            && tank1.y <= (monster.y + 32)
            && monster.y <= (tank1.y + 32)
        ) {
        ++monstersCaught;
        reset();
    }





    if (shotT) {
        shots(tank1.x, tank1.y, tank1.getPositionOnMap());

        if (
            bullet.x <= (monster.x + 32)
                && monster.x <= (bullet.x + 32)
                && bullet.y <= (monster.y + 32)
                && monster.y <= (bullet.y + 32)
            ) {
            ++monstersCaught;
            bulletStatus = false;
            bullet.x = 5000;
            vx = 0;
            tr = true;


            monster.speed = 0;
            monsterImage.src = "images/tankMonsterL_Boom.png";

            window.setTimeout(reset, 300);



            //setPositionUnit(monster, monster.x, p);

            //reset();
        }


    } else {
        bulletStatus = true;
        bulletReady = true;

    }


};


// Draw everything
var render = function () {
    if (bgReady) {
        ctx.drawImage(bgImage, 0, 0);
    }

    if (tank1.getReady()) {
        ctx.drawImage(tank1.getImage(), tank1.x, tank1.y);


    }

    if (monsterReady) {
        ctx.drawImage(monsterImage, monster.x, monster.y);
        // my label for monster
        //setLabelForUnit(monster, " MONSTER ")

    }

    if (!bulletReady) {
        ctx.drawImage(bulletImage, bullet.x, bullet.y);
        //setLabelForUnit(bullet, " BULLET ")

    }


    // Score
    ctx.beginPath();
    ctx.fillStyle = "rgb(250, 250, 250)";
    ctx.font = "15px Helvetica";
    ctx.textAlign = "left";
    ctx.textBaseline = "top";

    ctx.fillText("TANK #1: ", 32, 52);
    ctx.fillText("position: " + tank1.getPositionOnMap(), 32, 72);
    ctx.fillText("gps: " + tank1.x + " " + tank1.y, 32, 92);

    ctx.fillText(" ", 32, 112);

    ctx.fillText("MONSTER #1: ", 32, 132);
    ctx.fillText("dead monster: " + monstersCaught, 32, 152);
    ctx.fillText("gps:  " + monster.x + " " + monster.y, 32, 172);

    ctx.closePath();
};


// Let's play this game!
reset();
var then = Date.now();
setInterval(main, 1); // Execute as fast as possible


setPositionUnit(tank1, 250, 358);

setPositionUnit(monster, 800, 220);

//setPositionUnit(bullet,300,180);

